<template>
  <view class="list-left">
    <view class="author">{{item.author}}</view>
    <view class="title">{{item.title}}</view>
    <view class="box">
      <view class="music">musci,llllllllllllllll</view>
    </view>
  </view>
</template>

<script>
  export default {
    props:['item'],
    name:"videoText",
    data() {
      return {
        
      };
    }
  }
</script>

<style>
.list-left{
  width: 150px;
  height:150px;
  margin-left: 10px;
  color:#FFFFFF;
}
.author{
  height:35px;
  line-height: 35px;
  font-size: 15px;
}
.title{
  line-height: 22px;
  font-size: 12px;
  width:100%;
}
.box{
  width:100px;
  overflow: hidden;
}
.music{
  height:35px;
  width:100%;
  line-height: 35px;
  font-size: 12px;
  animation: musicc 4s linear 0.2s infinite;
}

@keyframes musicc {
  0%{
    transform: translate3d(80%,0,0)
  }
  100%{
    transform: translate3d(-80%,0,0)
  }
}
</style>